$(function () {

    function showGoodsData(data) {
        var $glItems = $('.items-large').empty();
        // console.log($glItems);
        data.forEach((item) => {
            // console.log(item.yuanjia);
            var str = `
            <li class="gl-item" data-id="${item.id}">
            <div class="gl-i-wrap tm-m-photos tm-m-photos">
                <div class="p-img tm-m-photo-viewer">

                    <img src="${item.img[0]}" class="bigImg">
                </div>
                <div class="sider">
                    <a href="javascript:void(0);" class="sider-prev prevStop"><i
                            class="iconfont icon-left"></i></a>
                    <ul>
                        `;

            item.img.forEach(itemImg => {
                str +=
                    ` <li>
                                <img src="${itemImg}" class="smallImg" alt="" width="26" height="26">
                            </li>`
            })
            str += `
                        </ul>
                    </div>
                    <div class="p-lie">
                        <div class="p-price">￥${item.jiage}</div>
                        <div class="p-num">
                            已售
                            <em>${item.xiaoliang}</em>
                            件
                        </div>
                    </div>
                    <div class="p-name">
                        <a href="" title="${item.title}">
                            ${item.title}
                        </a>
                    </div>
                    <div class="p-store">
                    
                        `;

            str += `
                    </div>
                    <div class="label-list"></div>
                    <div class="p-operate">
                        <a href="javascript:void(0);" id="compareLink">
                        <input id="${item.id}" type="checkbox" name="duibi" class="ui-checkbox"
                            >
                        <label class="ui-label" for="${item.id}">对比</label>
                    </a>
                    <a href="javascript:collect(643,'large');" class="choose-btn-coll">
                        <span class="iconfont icon-ban"></span>
                        收藏
                    </a>
                    <a href="javascript:void(0);"
                        
                        data-dialog="addCart_dialog" data-divid="addCartLog" data-title="请选择属性"
                        class="addcart">
                        <span class="iconfont icon-gouwuche
                            "></span>
                        加入购物车
                    </a>
                    </div>
                </div>
            </li>
            `;
            $glItems.append(str)
            // console.log($glItems);
            // console.log(str);
        })
    }

    showGoodsData(allData.shangpin);

    $('#mr').click(() => {

        showGoodsData(allData.shangpin);

    })
    $('#jg').click(() => {
        // $(this).css('color', 'red');
        // $(this).parent().children().css('color', 'gray')
        var temp = [];
        $.extend(temp, allData.shangpin);
        temp.sort((a, b) => {
            return b['jiage'] - a['jiage'];
        })
        showGoodsData(temp);
    })
    $('#pls').click(() => {
        var temp = [];
        $.extend(temp, allData.shangpin);
        temp.sort((a, b) => {
            return b['pingjia'] - a['pingjia'];
        })
        showGoodsData(temp);
    })
    $('#xl').click(() => {
        var temp = [];
        $.extend(temp, allData.shangpin);
        temp.sort((a, b) => {
            return b['xiaoliang'] - a['xiaoliang'];
        })
        showGoodsData(temp);
    })
    // $('#xp').click(() => {
    //     var temp = [];
    //     $.extend(temp, goodsArr);
    //     temp.sort((a, b) => {
    //         return new Date(a['launch-timee']).getTime() - new Date(b['launch-timee']).getTime();
    //     })
    //     showGoodsData(temp);

    // })
    // console.log($('.fp-box input'));
    $('.fp-box input').blur((e) => {
        var minPrice = $('#price-min').val();
        var maxPrice = $('#price-max').val();
        var temp = [];
        $.extend(temp, allData.shangpin);
        if (minPrice && maxPrice) {
            showGoodsData(temp.filter((item) => {
                return item['jiage'] >= minPrice && item['jiage'] <= maxPrice
            }))
        } else if (minPrice && !maxPrice) {
            showGoodsData(temp.filter((item) => {
                return item['jiage'] >= minPrice;
            }))
        } else if (!minPrice && maxPrice) {
            showGoodsData(temp.filter((item) => {
                return item['jiage'] <= maxPrice;
            }))
        } else if (!minPrice && !maxPrice) {
            showGoodsData(allData.shangpin)
        }
    })


    // $('.filter-sort a');
    $('.filter-sort a').click(function () {
        $(this).parent().children().css('color', 'gray')
        // if (flag = 2) {
        $(this).css('color', 'red');
        $(this).parent().children().children('span').prop('class', 'iconfont icon-xiangshangjiantou')
        $(this).children('span').prop('class', 'iconfont icon-xiangxiajiantou1')
    })
})